<html>
<head>
    <meta charset="UTF-8" />
    <title>数字乡村助力乡村振兴</title>
    <script src="{{asset('front/data_screen/js/jquery2.1.4/jquery.min.js')}}"></script>
    <script src="{{asset('front/data_screen/js/highcharts/highcharts.js')}}"></script>
    <script src="{{asset('front/data_screen/js/highcharts/highcharts-3d.js')}}"></script>
    <script src="{{asset('front/data_screen/js/echarts/echarts.js')}}"></script>
    <link rel="stylesheet" href="{{asset('/front/data_screen/css/index.css')}}">

</head>

<body>
<div class="content-bg">

    <!-- 顶部标题start -->
    <div class="top-content">
        <div class="page-title">数字乡村助力乡村振兴</div>
        <div class="c-title c-left">
            山西省晋中市太谷县北洸乡
            <img src="{{ url('/front/data_screen/img/dingwei.png') }}" alt="">
        </div>
        <div class="c-title c-rigth">
			{{date('Y-m-d H:i',time())}}
            <img src="{{ url('/front/data_screen/img/time.png') }}" alt="">
        </div>
    </div>
    <!-- 顶部标题end -->

    <!-- 中间层数据start -->
    <div class="middle-content left">
        <!-- 基础数据start -->
        <div class="data-box left jichu">
            <div class="box-title">基础数据</div>
            <div class="jc-peopel-num">
                总人口：22690人 &nbsp;&nbsp; 常驻人口：21465人 &nbsp;&nbsp; 家庭人均数：3人
            </div>
            <div class="jc-pie-data">
                <div class="item-data">
                    <div class="item-pie left" id="jichu_sex"></div>
                    <div class="item-pie-info left">
						@foreach ($sex_data as $k => $v)
							<div class="item-info-item">{{ $v[0] }}：{{$v[1]}}%</div>
						 @endforeach
                    </div>
                    <div class="pie-name">男女比例</div>
                </div>

                <div class="item-data right education">
                    <div class="item-pie left" id="jichu_education"></div>
                    <div class="item-pie-info left">
                        @foreach ($education_data as $k => $v)
                        <div class="item-info-item">{{ $v[0] }}</div>
						 @endforeach
                    </div>
                    <div class="pie-name">学历结构</div>
                </div>

                <div class="item-data clear age">
                    <div class="item-pie left" id="jichu_age"></div>
                    <div class="pie-name">年龄结构</div>
                </div>


            </div>
        </div>
        <!-- 基础数据end -->

        <!-- 地图数据start -->
        <div class="map-box left">
            <img src="{{ url('/front/data_screen/img/map_dingwei.png') }}" alt="">
            <img src="{{ url('/front/data_screen/img/map_village.png') }}" alt="">
            <img src="{{ url('/front/data_screen/img/map_province.png') }}" alt="">
        </div>
        <!-- 地图数据end -->

        <!-- 产业兴旺start -->
        <div class="data-box right chanye">
            <div class="box-title">产业兴旺</div>
            <div class="cy-congye left">
                <div class="title left">从业结构</div>
                <div class="tap-item left" style="display:none">
                  @foreach ($job_categories_data as $k => $v)
                    <div>{{ $v['text']}}</div>
				 @endforeach
                </div>
                <div class="radar-data right" id="chanye_radar"></div>
            </div>

            <div class="cy-nongye left">
                <div class="title left">农业从业人数</div>
                <div class="nongye-data clear left" id="nongye_radar"></div>
                <div class="tap-item right">
				    @foreach ($nongye_data as $k => $v)
                    <div>{{$v['name']}}</div>
					 @endforeach
                </div>
            </div>

            <div class="cy-renjun right">
                <div class="title">人均收入</div>
                <div class="renjun-data" id="renjun_radar"></div>
                <div class="tap-item">
                    <div>农业收入占比 {{$zhanbi}}%</div>
                    
                </div>
            </div>
        </div>
        <!-- 产业兴旺end -->
    </div>
    <!-- 中间层数据end -->

    <!-- 底部数据start -->
    <div class="middle-content left bottom-content">
        <!-- 生活富裕start -->
        <div class="data-box left shenghuo">
            <div class="box-title">生活富裕</div>

            <div class="tudi">
                <div class="tudi-item">
                    <div class="tudi-item-data" id="tudi_radar1"></div>
                    <div class="data-title">行政区划面积</div>
                </div>
                <!--<div class="tudi-item">
                    <div class="tudi-item-data" id="tudi_radar2"></div>
                    <div class="data-title">使用面积</div>
                </div>-->
                <div class="tudi-item">
                    <div class="tudi-item-data" id="tudi_radar3"></div>
                    <div class="data-title">宅基地面积</div>
                </div>
                <div class="tudi-item">
                    <div class="tudi-item-data" id="tudi_radar4"></div>
                    <div class="data-title">农田面积</div>
                </div>
            </div>

            <div class="tudi-info">
                <div class="tudi-info-item">行政区划面积<div>667万km²</div></div>
               <!-- <div class="tudi-info-item">使用面积<div>48.9km²</div></div>-->
                <div class="tudi-info-item">宅基地面积<div>134万km²</div></div>
                <div class="tudi-info-item">农田面积<div>533万km²</div></div>
            </div>

            <div class="jiaoyu left">
                <div class="jiaoyu-data" id="jiaoyu_radar"></div>
                <div class="data-title">子女教育</div>
            </div>

            <div class="chuxing right">
                <div class="data-radar left">
                    <div class="chuxing-data" id="chuxing_radar"></div>
                    <div class="data-title">出行方式</div>
                </div>

                <div class="radar-info right">
				 @foreach ($chuxing_data as $k => $v)
                    <div>{{$v}}</div>
				 @endforeach
               
                </div>
            </div>

        </div>
        <!-- 生活富裕end -->

        <!-- 乡风文明、治理有效start -->
        <div class="xiangfeng-box">
            <div class="title-data">
                <img src="{{ url('/front/data_screen/img/xiangfeng_icon.png') }}" alt="">
                乡风文明、治理有效
            </div>

            <div class="xaingfeng-table left">
                <div class="title-item data-item">
                    <div>治理有效</div>
                    <div>条数</div>
                    <div>治理有效</div>
                    <div>条数</div>
                </div>

                <div class="data-item">
                    <div>政策发布</div>
                    <div>{{$zcnum}}</div>
                    <div>律师咨询</div>
                    <div>0</div>
                </div>

                <div class="data-item">
                    <div>通知公告</div>
                    <div>{{$tznum}}</div>
                    <div>法律宣传</div>
                    <div>{{$pfnum}}</div>
                </div>

                <div class="data-item">
                    <div>纠纷调节</div>
                    <div>0</div>
                    <div>党政宣传</div>
                    <div>{{$dznum}}</div>
                </div>

                <div class="data-item">
                    <div>公证服务</div>
                    <div>{{$gznum}}</div>
                    <div>群众反馈</div>
                    <div>{{$fknum}}</div>
                </div>
            </div>

            <div class="wenhua-info right">
                <div class="wenhua-title">文化设施</div>
                <div class="wenhua-radar" id="wenhua_radar"></div>
                <div class="radar-info">
                    @foreach ($wenhua as $k => $v)
                    <div>{{$v}}</div>
					 @endforeach
                </div>
            </div>
        </div>
        <!-- 乡风文明、治理有效end -->

        <!-- 生态宜居start -->
        <div class="data-box right shengtai">
            <div class="box-title">生态宜居</div>

            <div class="box-s-title">满意度调查</div>
            <div class="manyidu-data" id="manyidu_radar"></div>

            <div class="box-s-title left jiuyi-title">就医方式</div>
            <div class="jiuyi-data right">
                <div class="jiuyi-item left">
                    <div class="jiuyi-i-title">驻村医生</div>
                    <div class="jiuyi-i-line"></div>
                </div>
                <div class="jiuyi-item left">
                    <div class="jiuyi-i-title">卫生服务站</div>
                    <div class="jiuyi-i-line"></div>
                </div>
                <div class="jiuyi-item left">
                    <div class="jiuyi-i-title">县区医院</div>
                    <div class="jiuyi-i-line" style="width: .8rem;"></div>
                </div>
                <div class="jiuyi-item left">
                    <div class="jiuyi-i-title">网络问诊</div>
                    <div class="jiuyi-i-line" style="width: .6rem;"></div>
                </div>
            </div>
        </div>
        <!-- 生态宜居end -->
    </div>
    <!-- 底部数据end -->


</div>
 
</body>

<script src="{{asset('front/data_screen/js/highcharts/modules/cylinder.js')}}"></script>
<script src="{{asset('front/data_screen/js/highcharts/modules/funnel3d.js')}}"></script>
<script src="{{asset('front/data_screen/js/highcharts/modules/pyramid3d.js')}}"></script>
<script src="{{asset('front/data_screen/js/index.js')}}"></script>
<script src="{{asset('front/data_screen/js/pagesize.js')}}"></script>

<script>
 var a='<?= $data;?>';
dataload(<?= $data;?>)
</script>
</html>
